<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="/static/base/common/css/sapar.css" />
    <link rel="stylesheet" type="text/css" href="/static/base/common/css/common.css" />
    <script type="text/javascript" src="/static/base/common/js/jquery.js"></script>
    <script type="text/javascript" src="/static/base/common/js/sapar.js"></script>
    <script type="text/javascript" src="/static/base/common/js/WdatePicker.js"></script>
    <link rel="stylesheet" type="text/css" href="/static/webjars/layui/css/layui.css" media="all"/>

    <title>居民与房屋管理</title>
</head>

<body class="layui-layout-body" >
<div class="subfiled clearfix">
    <h2>居民与房屋管理</h2>
</div>
<div class="demoTable" style="margin-top: 5px">
    搜索ID：
    <div class="layui-inline">
        <input class="layui-input" name="id" id="demoReload" autocomplete="off">
    </div>
    <button class="layui-btn" data-type="reload">搜索</button>
</div>

<div >
    <div id="saper-container" style="overflow-y: scroll;height: 900px;" >

        <div style="padding: 20px; background-color: #F2F2F2;height: 150px;margin: 20px auto;">
            <div class="layui-card" id="left" style="width: 100px;float:left;height: 150px">

                <div class="layui-card-body" style="padding: 10px">
                    <img src="/static/images/app-logo.png" alt="这是一张图片" style="width: 80px;height: 80px;"/>
                </div>
                <div class="layui-card-body" style="height: 20px;border-top: 1px #CCC solid;padding-left: 30px">
                    1001
                </div>
            </div>
            <div class="layui-container" id="center" style="width: calc(100% - 200px) ;float: left">

                <div class="layui-row layui-col-space1 layui-card">

                    <div class="layui-row grid-demo ">
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主姓名:<span style="padding-left: 10px;color: #0C0C0C;">李顺时</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主性别:<span style="padding-left: 10px;color: #0C0C0C;">男</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">联系电话:<span style="padding-left: 10px;color: #0C0C0C;">18208224530</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">坐落位置:<span style="padding-left: 10px;color: #0C0C0C;">四川省宜宾市翠屏区</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">详细地址:<span style="padding-left: 10px;color: #0C0C0C;">宜宾学院A区2平台11舍</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">房屋状态:<span style="padding-left: 10px;color: #0C0C0C;">正常</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">建筑名称:<span style="padding-left: 10px;color: #0C0C0C;">硕勋楼</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">所在楼层:<span style="padding-left: 10px;color: #0C0C0C;">8层</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">修改日期:<span style="padding-left: 10px;color: #0C0C0C;">2018/07/13</span></div>
                        </div>
                    </div>


                </div>

            </div>
            <div class="layui-card" id="right" style="width: 100px;float:right;height: 150px">
                <div class="layui-card-header">操作</div>
                <div class="layui-card-body">
                    <a href="/house/details" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">查看详细</a>
                    <br/>
                    <a href="/house/update" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">修改信息</a>
                    <br/>
                    <button href="#" class="layui-btn layui-btn-primary layui-btn-xs" id="0" style="margin-bottom: 2px">删除信息</button>
                </div>
            </div>
        </div>

        <div style="padding: 20px; background-color: #F2F2F2;height: 150px;margin: 20px auto;">
            <div class="layui-card" id="left1" style="width: 100px;float:left;height: 150px">

                <div class="layui-card-body" style="padding: 10px">
                    <img src="/static/images/app-logo.png" alt="这是一张图片" style="width: 80px;height: 80px;"/>
                </div>
                <div class="layui-card-body" style="height: 20px;border-top: 1px #CCC solid;padding-left: 30px">
                    1002
                </div>
            </div>
            <div class="layui-container" id="center1" style="width: calc(100% - 200px) ;float: left">

                <div class="layui-row layui-col-space1 layui-card">

                    <div class="layui-row grid-demo ">
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主姓名:<span style="padding-left: 10px;color: #0C0C0C;">张举</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主性别:<span style="padding-left: 10px;color: #0C0C0C;">男</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">联系电话:<span style="padding-left: 10px;color: #0C0C0C;">18205422460</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">坐落位置:<span style="padding-left: 10px;color: #0C0C0C;">四川省宜宾市翠屏区</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">详细地址:<span style="padding-left: 10px;color: #0C0C0C;">宜宾学院A区2平台11舍</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">房屋状态:<span style="padding-left: 10px;color: #0C0C0C;">正常</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">建筑名称:<span style="padding-left: 10px;color: #0C0C0C;">实验楼</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">所在楼层:<span style="padding-left: 10px;color: #0C0C0C;">3层</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">修改日期:<span style="padding-left: 10px;color: #0C0C0C;">2018/07/13</span></div>
                        </div>
                    </div>


                </div>

            </div>
            <div class="layui-card" id="right1" style="width: 100px;float:right;height: 150px">
                <div class="layui-card-header">操作</div>
                <div class="layui-card-body">
                    <a href="/house/details" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">查看详细</a>
                    <br/>
                    <a href="/house/update" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">修改信息</a>
                    <br/>
                    <a href="#" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">删除信息</a>
                </div>
            </div>
        </div>

        <div style="padding: 20px; background-color: #F2F2F2;height: 150px;margin: 20px auto;">
            <div class="layui-card" id="left2" style="width: 100px;float:left;height: 150px">

                <div class="layui-card-body" style="padding: 10px">
                    <img src="/static/images/app-logo.png" alt="这是一张图片" style="width: 80px;height: 80px;"/>
                </div>
                <div class="layui-card-body" style="height: 20px;border-top: 1px #CCC solid;padding-left: 30px">
                    1003
                </div>
            </div>
            <div class="layui-container" id="center2" style="width: calc(100% - 200px) ;float: left">

                <div class="layui-row layui-col-space1 layui-card">

                    <div class="layui-row grid-demo ">
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主姓名:<span style="padding-left: 10px;color: #0C0C0C;">李顺时</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主性别:<span style="padding-left: 10px;color: #0C0C0C;">男</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">联系电话:<span style="padding-left: 10px;color: #0C0C0C;">18208224530</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">坐落位置:<span style="padding-left: 10px;color: #0C0C0C;">四川省宜宾市翠屏区</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">详细地址:<span style="padding-left: 10px;color: #0C0C0C;">宜宾学院A区2平台11舍</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">房屋状态:<span style="padding-left: 10px;color: #0C0C0C;">正常</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">建筑名称:<span style="padding-left: 10px;color: #0C0C0C;">硕勋楼</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">所在楼层:<span style="padding-left: 10px;color: #0C0C0C;">8层</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">修改日期:<span style="padding-left: 10px;color: #0C0C0C;">2018/07/13</span></div>
                        </div>
                    </div>


                </div>

            </div>
            <div class="layui-card" id="right2" style="width: 100px;float:right;height: 150px">
                <div class="layui-card-header">操作</div>
                <div class="layui-card-body">
                    <a href="/house/details" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">查看详细</a>
                    <br/>
                    <a href="/house/update" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">修改信息</a>
                    <br/>
                    <a href="#" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">删除信息</a>
                </div>
            </div>
        </div>
        <div style="padding: 20px; background-color: #F2F2F2;height: 150px;margin: 20px auto;">
            <div class="layui-card" id="left3" style="width: 100px;float:left;height: 150px">

                <div class="layui-card-body" style="padding: 10px">
                    <img src="/static/images/app-logo.png" alt="这是一张图片" style="width: 80px;height: 80px;"/>
                </div>
                <div class="layui-card-body" style="height: 20px;border-top: 1px #CCC solid;padding-left: 30px">
                    1004
                </div>
            </div>
            <div class="layui-container" id="center3" style="width: calc(100% - 200px) ;float: left">

                <div class="layui-row layui-col-space1 layui-card">

                    <div class="layui-row grid-demo ">
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主姓名:<span style="padding-left: 10px;color: #0C0C0C;">何平</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主性别:<span style="padding-left: 10px;color: #0C0C0C;">男</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">联系电话:<span style="padding-left: 10px;color: #0C0C0C;">13708199430</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">坐落位置:<span style="padding-left: 10px;color: #0C0C0C;">四川省宜宾市翠屏区</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">详细地址:<span style="padding-left: 10px;color: #0C0C0C;">宜宾学院A区2平台11舍</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">房屋状态:<span style="padding-left: 10px;color: #0C0C0C;">正常</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">建筑名称:<span style="padding-left: 10px;color: #0C0C0C;">十一舍</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">所在楼层:<span style="padding-left: 10px;color: #0C0C0C;">5层</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">修改日期:<span style="padding-left: 10px;color: #0C0C0C;">2018/07/13</span></div>
                        </div>
                    </div>


                </div>

            </div>
            <div class="layui-card" id="right3" style="width: 100px;float:right;height: 150px">
                <div class="layui-card-header">操作</div>
                <div class="layui-card-body">
                    <a href="/house/details" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">查看详细</a>
                    <br/>
                    <a href="/house/update" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">修改信息</a>
                    <br/>
                    <a href="#" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">删除信息</a>
                </div>
            </div>
        </div>

        <div style="padding: 20px; background-color: #F2F2F2;height: 150px;margin: 20px auto;">
            <div class="layui-card" id="left4" style="width: 100px;float:left;height: 150px">

                <div class="layui-card-body" style="padding: 10px">
                    <img src="/static/images/app-logo.png" alt="这是一张图片" style="width: 80px;height: 80px;"/>
                </div>
                <div class="layui-card-body" style="height: 20px;border-top: 1px #CCC solid;padding-left: 30px">
                    1001
                </div>
            </div>
            <div class="layui-container" id="center4" style="width: calc(100% - 200px) ;float: left">

                <div class="layui-row layui-col-space1 layui-card">

                    <div class="layui-row grid-demo ">
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主姓名:<span style="padding-left: 10px;color: #0C0C0C;">方俊杰</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">户主性别:<span style="padding-left: 10px;color: #0C0C0C;">男</span></div>
                            <div class="grid-demo grid-demo-bg1" style="line-height: 50px;padding-left: 10px;color: #007DDB;">联系电话:<span style="padding-left: 10px;color: #0C0C0C;">18162136230</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">坐落位置:<span style="padding-left: 10px;color: #0C0C0C;">四川省宜宾市翠屏区</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">详细地址:<span style="padding-left: 10px;color: #0C0C0C;">宜宾学院A区2平台11舍</span></div>
                            <div class="grid-demo grid-demo-bg2" style="line-height: 50px;color: #007DDB;">房屋状态:<span style="padding-left: 10px;color: #0C0C0C;">正常</span></div>
                        </div>
                        <div class="layui-col-md4" style="height: 150px;">
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">建筑名称:<span style="padding-left: 10px;color: #0C0C0C;">11舍</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">所在楼层:<span style="padding-left: 10px;color: #0C0C0C;">1层</span></div>
                            <div class="grid-demo grid-demo-bg3" style="line-height: 50px;color: #007DDB;">修改日期:<span style="padding-left: 10px;color: #0C0C0C;">2018/07/12</span></div>
                        </div>
                    </div>


                </div>

            </div>
            <div class="layui-card " id="right4" style="width: 100px;float:right;height: 150px">
                <div class="layui-card-header">操作</div>
                <div class="layui-card-body">
                    <a href="/house/details" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">查看详细</a>
                    <br/>
                    <a href="/house/update" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">修改信息</a>
                    <br/>
                    <a href="#" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-bottom: 2px">删除信息</a>
                </div>
            </div>
        </div>
        <div style="width: 100%;height: 400px">
            <div id="demo1"></div>


        </div>

    </div>

</div>
</body>
<script src="/static/webjars/layui/layui.all.js"></script>
<script>
    layui.use(['laypage', 'layer'], function(){
        var laypage = layui.laypage
            ,layer = layui.layer;

        //总页数大于页码总数
        laypage.render({
            elem: 'demo1'
            ,count: 25 //数据总数
            ,jump: function(obj){
                console.log(obj)
            }
        });
    });
</script>


<script type="text/javascript">
    $('select').iSelect();
</script>
</html>